<template>
  <div>
    <van-nav-bar  @click-left="back">
      <template #left>
        <van-icon name="arrow-left" color="#000" size="22" />
      </template>
    </van-nav-bar>
    <div class="phone_cz">
      手机重置密码
    </div>
    <van-form>
      <van-field 
      v-model="phone" 
      placeholder="请输入手机号"
      clearable
      />
      <van-field
        v-model="sms"
        center
        label="短信验证码"
        placeholder="请输入验证码"
        clearable
      >
        <template #button>
          <van-button size="small" type="primary" @click="getSms">获取验证码</van-button>
        </template>
      </van-field>
      <van-field
        v-model="password"
        center
        label="密码"
        placeholder="设置新密码"
        clearable
      />
      <van-button round block type="info" native-type="submit">确认</van-button>
    </van-form>
  </div>
</template>
<script>
export default {
  data(){
    return{
      sms:'',
      phone:'',
      password:'',
    }
  },
  methods: {
    back() {
      this.$router.go(-1);
    },
    getSms(){

    }
  },
};
</script>
<style scoped>
.phone_cz{
  color: #141414;
  font-size: 24px;
  font-weight: 500;
  margin: 40px 35px;
}
.van-button--info {
 background-color: #48803f;
  border: 1px solid #52794c;
}
.van-button--primary{
  background-color: transparent;
  border: 1px solid #333;
  color: #666;
  border-radius: 999px;
  padding: 0 15px;
}
</style>